<template>
  <view>
    <u-navbar title="我的病例" back-icon-size="34" title-size="36" :border-bottom="false" :background="background" title-color="#222" back-icon-color="#222"></u-navbar>
    <scroll-view :scroll-top="scrollTop" scroll-x="true" class="scroll-Y" style="white-space: nowrap; background: #fff">
      <view class="" style="display: flex; align-items: center; background: #fff; height: 170rpx; margin-left: 36rpx">
        <view :class="current == k ? 'on1' : 'on'" v-for="(i, k) in list" :key="k" style="margin-right: 30rpx" @tap="(current = k), mycode(), getCaseImgRes()">
          <view class="" style="font-size: 28rpx">
            {{ i.patient_name }}
          </view>
          <view class="" style="font-size: 24rpx">{{ i.patient_gender_text }} · {{ i.patient_age }}岁</view>
        </view>
      </view>
    </scroll-view>
    <view class="" style="margin: 28rpx; border-radius: 20rpx; background: #fff">
      <view class="" style="font-size: 32rpx; font-weight: bold; padding: 39rpx 38rpx">实体医疗机构病历</view>
      <view class="" style="padding-left: 34rpx; padding-bottom: 57rpx; display: flex; align-items: center; flex-wrap: wrap">
        <image
          :src="img_url + item"
          mode="aspectFill"
          @click="util.seeimg([img_url + item], index)"
          v-for="(item, index) in blimg"
          :key="index"
          style="width: 162rpx; height: 162rpx; border-radius: 10rpx; margin-right: 20rpx; margin-bottom: 10rpx"
        ></image>
        <image src="https://wenzhen.fuerle168.com/static/user/upload.png" mode="" style="width: 162rpx; height: 162rpx" @tap="show = true"></image>
      </view>
    </view>
    <u-modal v-model="show" title="上传[实体医疗机构病历资料]" :show-cancel-button="true" @confirm="confirm">
      <view class="slot-content">
        <view class="" style="font-size: 28rpx; padding: 30rpx">根据《互联网医院管理办法》，请上传包含 医生诊断及患者信息的处方或病历</view>
        <view class="" style="padding-left: 43rpx">
          <u-upload :action="action" :file-list="fileList" @on-uploaded="onUploaded" max-count="1" :form-data="formData" width="135" height="135"></u-upload>
        </view>
      </view>
    </u-modal>
    <!-- tab、切换 -->
    <u-tabs :list="lists" active-color="#1A9EFF" :is-scroll="false" :current="currents" @change="change"></u-tabs>
    <!-- 按房开药 -->
    <view class="" style="margin: 20rpx 28rpx; background: #fff; border-radius: 20rpx" v-for="(i, k) in user" :key="k">
      <view class="" style="padding: 36rpx; display: flex; align-items: center; justify-content: space-between; border-bottom: 1rpx solid #f8f8f8">
        <view class="" style="font-size: 30rpx">
          {{ i.order_way == 1 ? i.order_way_text : i.doctor_title }} {{ ' ' }}
          {{ i.order_res.order_type_text ? '(' + i.order_res.order_type_text + ')' : '' }}
        </view>
        <view class="" style="font-size: 24rpx; color: #666">
          {{ i.createtime_text }}
        </view>
      </view>

      <view class="" style="padding: 36rpx; border-bottom: 1rpx solid #f8f8f8">
        <view class="" style="display: flex; align-items: center; justify-content: space-between">
          <view class="" style="font-size: 30rpx">患者自述</view>
          <view class="" style="font-size: 24rpx; color: #666" @tap="vir(i)">
            {{ i.order_way == 1 ? '查看申请开药详情' : '查看问诊详情' }}
          </view>
        </view>
        <view class="" style="font-size: 24rpx; color: #666; padding-top: 25rpx">
          {{ i.illness_one }}
        </view>
      </view>

      <view class="" style="padding: 36rpx; border-bottom: 1rpx solid #f8f8f8" v-if="i.drugs_status > 1">
        <view class="" style="display: flex; align-items: center; justify-content: space-between">
          <view class="" style="font-size: 30rpx; display: flex; align-items: center">
            <view class="">医生方案</view>
            <view class="gets" style="margin-left: 20rpx">
              {{ i.pharmacist_auth == 0 ? '待审核' : i.pharmacist_auth == 1 ? '审核通过' : '审核拒绝' }}
            </view>
          </view>
          <view class="" style="font-size: 24rpx; color: #666" @tap="gets(i)">查看治疗方案详情</view>
        </view>
        <view class="" style="font-size: 24rpx; color: #666; padding-top: 25rpx">
          {{ i.Illness }}
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  name: '',
  data() {
    return {
      background: {
        background: '#fff'
      },
      scrollTop: 0,
      list: [],
      current: 0,
      show: false,
      action: 'https://wenzhen.fuerle168.com/api/common/upload',
      fileList: [],
      user: [],
      formData: {
        token: uni.getStorageSync('user_info').token
      },
      imgbox: [],
      blimg: [],
      currents: 0,
      lists: [
        {
          name: '已开处方'
        },
        {
          name: '待配药'
        },
        {
          name: '已配药'
        },
        {
          name: '已完成'
        }
      ]
    };
  },
  //方法
  methods: {
    change(index) {
      this.currents = index;
      this.mycode();
    },
    confirm() {
      if (this.imgbox == '') {
        uni.showToast({
          title: '请选择图片',
          icon: 'none'
        });
      } else {
        this.api({
          url: '/api/patient/addCaseImg',
          method: 'post',
          data: {
            img: this.imgbox,
            patient_id: this.list[this.current].patient_id
          }
        }).then((res) => {
          this.getCaseImgRes();
          uni.showToast({
            title: res.msg,
            icon: 'none'
          });
        });
      }
    },
    onUploaded(res) {
      let imgs = [];
      res.map((i) => {
        imgs.push(i.response.data.url);
      });
      this.imgbox = [...new Set(imgs)];
      console.log(this.imgbox);
    },
    vir(e) {
      if (e.order_way == 1) {
        uni.navigateTo({
          url: '/pages/news/load?id=' + e.id
        });
      } else {
        uni.navigateTo({
          url: 'virusdetail?type=' + JSON.stringify(e)
        });
      }
    },
    gets(e) {
      if (e.pharmacist_auth == 0) {
        uni.showToast({
          title: '药方医师审核中',
          icon: 'none'
        });
      } else if (e.pharmacist_auth == 2) {
        uni.showToast({
          title: '药方医师已拒绝，请耐心等待医生再次开方',
          icon: 'none'
        });
      } else {
        if (e.drugs_status == 2) {
          if (e.order_way == 1) {
            uni.navigateTo({
              url: '/pages/news/scheme?id=' + e.id + '&type'
            });
          } else {
            uni.navigateTo({
              url: '/pages/news/scheme?id=' + e.order_id
            });
          }
        } else {
          console.log(e);
          uni.navigateTo({
            url: 'yaodetail?type=' + JSON.stringify(e)
          });
        }
      }
    },
    oss() {
      this.api({
        url: '/api/index/patientList',
        method: 'post'
      }).then((res) => {
        this.list = res.data;

        this.mycode();
        this.getCaseImgRes();
      });
    },
    mycode() {
      this.api({
        url: '/api/user/getUserCase',
        method: 'post',
        data: {
          patient_id: this.list[this.current].patient_id,
          style: this.currents + 1
        }
      }).then((res) => {
        this.user = res.data.data;
      });
    },
    getCaseImgRes() {
      this.api({
        url: '/api/patient/getCaseImgRes',
        method: 'post',
        data: {
          patient_id: this.list[this.current].patient_id
        }
      }).then((res) => {
        this.blimg = res.data;
      });
    }
  },
  //首页渲染
  onLoad(options) {},
  onShow() {
    this.oss();
  },
  //监听
  watch: {},
  //计算属性
  computed: {}
};
</script>

<style lang="scss" scoped>
.on {
  padding: 21rpx 53rpx 15rpx 25rpx;
  background: #f0f0f0;
  border-radius: 20rpx;
}

page {
  background: #f8f8f8;
}

.on1 {
  padding: 21rpx 53rpx 15rpx 25rpx;

  background: linear-gradient(0deg, #1a9eff 0%, #0fb8ff 100%);
  border-radius: 20rpx;
  color: #fff;
}

.gets {
  // width: 92rpx;
  padding: 0 10rpx;
  height: 40rpx;
  background: #e4f4ff;
  border-radius: 20rpx;
  text-align: center;
  line-height: 40rpx;
  font-size: 24rpx;
  color: #1a9eff;
}
</style>
